.content {
    .role-name {
        padding-top: 22px;
        padding-left: 24px;
        border: 1px solid #eaeaea;
        background-color: #f9f9f9;
        .el-form {
            width: 500px;
        }
    }
    .role-modules {
        margin-top: 24px;

        .content {
            .title {
                padding-bottom: 4px;

                border-bottom: 1px solid #eaeaea;
            }
            .title-font {
                letter-spacing: 1px;

                color: #555;

                font-size: 16px;

                font-weight: 500;

                line-height: 1.5;
            }
            .modules {
                margin-top: 12px;
                :deep(.el-tabs__content) {
                    .el-tab-pane {
                        .modules-item {
                            .modules-menu-item {
                                margin-bottom: 16px;
                                &:last-of-type {
                                    margin-bottom: 0;
                                }
                                .content {
                                    border: 1px solid #eaeaea;

                                    $padding-left: 18px;

                                    .title {
                                        padding-left: $padding-left;

                                        letter-spacing: 1px;

                                        color: #555;

                                        border-bottom: 1px solid #eaeaea;

                                        background-color: #f9f9f9;

                                        font-size: 13px;

                                        line-height: 42px;
                                    }
                                    .auth-list {
                                        .auth-item {
                                            display: flex;

                                            align-items: center;

                                            margin: 16px 0;

                                            padding-left: $padding-left;
                                            :deep(.el-checkbox) {
                                                .el-checkbox__label {
                                                    font-size: 13px;

                                                    font-weight: 300;
                                                }
                                            }
                                            .line {
                                                width: 1px;

                                                height: 16px;

                                                margin: 0 24px;

                                                background-color: #eee;
                                            }
                                        }
                                    }
                                }
                            }
                        }
                    }
                }
            }
        }
    }
    .role-store {
        margin-top: 24px;

        border-bottom: 1px solid #eaeaea;
    }
    .role-submit {
        display: flex;

        margin: 24px 0;

        justify-items: center;
    }
}
